<%@ page import="org.whp.mealplanner.server.PMF"%>
<%@ page import="org.whp.mealplanner.server.Ingredient"%>
<%@ page import="javax.jdo.PersistenceManager"%>
<%@ page import="java.util.List"%>
<%@ page import="javax.jdo.Extent"%>
<%@ page import="javax.jdo.Query"%>

<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" href="/style/addIngredient.css" type="text/css" />
<title>Add new ingredient</title>
<script
	src="http://www.google.com/jsapi?key=ABQIAAAANc4q3bIwmteElIO5__I_sBTwM0brOpm-All5BF6PoaKBxRWWERRlc8UGddZ4cFdAQssm2RJI7sQFAA"></script>
<script>
	google.load("jquery", "1.3.2");

	google.setOnLoadCallback(getFirstIngredients);

	function getFirstIngredients() {
		$.urlParam = function(name) {
			var results = new RegExp('[\\?&]' + name + '=([^&#]*)')
					.exec(window.location.href);
			return (results == null) ? 0 : results[1]
		};
		var startIdxV = 0;
		var endIdxV = 10;
		$(document).ready(function() {
			ingaddV = $.urlParam("ingadd")
			$.get("/getIngredients", {
				startIdx : startIdxV,
				endIdx : endIdxV,
				ingadd : ingaddV
			}, function(xml) {
				$("#ingredientsTable").html(xml);
			});
		});
		$("#next").click(function(e) {
			e.preventDefault();
			startIdxV += 10;
			endIdxV += 10;
			$.get("/getIngredients", {
				startIdx : startIdxV,
				endIdx : endIdxV
			}, function(xml) {
				$("#ingredientsTable").html(xml);
			});
		});
		$("#previous").click(function(e) {
			e.preventDefault();
			startIdxV -= 10;
			endIdxV -= 10;
			$.get("/getIngredients", {
				startIdx : startIdxV,
				endIdx : endIdxV
			}, function(xml) {
				$("#ingredientsTable").html(xml);
			});
		});
	}
</script>
</head>
<body>
	<div id="formWrapper">
		<p>Here you can add new ingredient. If one already is present it
			will shown to you and not save into database.</p>
		<table>
			<tbody>
				<form action="/addIngredients" method="post">
					<tr>
						<td>Name of ingredient:</td>
						<td><input type="text" name="name" /></td>
					</tr>
					<tr>
						<td>Units:</td>
						<td><input type="text" name="units" /></td>
					</tr>
					<tr>
						<td>&nbsp;</td>
						<td><input type="submit" name="addIngredients" value="Add" />
						</td>
					</tr>
			</tbody>
			</form>
		</table>
	</div>
	<form action="/removeIngredients" method="post">
		<table id="ingredientsTable">


		</table>
		<input type="submit" name="removeIngredients" value="Remove selected" />
	</form>
	<a href="#" id="previous">Previous&nbsp;</a>
	</a>
	<a href="#" id="next">&nbsp;Next</a>

</body>
</html>